<template>
  <div>
     <el-menu
     default-active="0"
      class="el-menu-vertical-demo"
      @open="handleOpen"
      @close="handleClose">
      <el-menu-item index="0" @click="toWu('/Wu')">
        <i class="el-icon-menu"></i>
        <span slot="title">物业总览</span>
      </el-menu-item>
     <el-submenu index="1">
        <template slot="title">
          <i class="el-icon-s-platform"></i>
          <span>访客管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="1-1" @click="toVisitor('/Visitor')">访客信息登记</el-menu-item>
          <el-menu-item index="1-2" @click="toVisitorAccess('/VisitorAccess')">访客进出记录</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
      <el-submenu index="2">
        <template slot="title">
          <i class="el-icon-s-help"></i>
          <span>车辆管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="2-1" @click="toCar('/Cars')">车辆信息管理</el-menu-item>
          <el-menu-item index="2-2" @click="toCarDoing('/CarDoings')">车辆进入记录</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
      <el-submenu index="3">
        <template slot="title">
          <i class="el-icon-s-open"></i>
          <span>设备管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="3-1" @click="handlerMenu('/Equipment')">车辆闸道管理</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
    </el-menu>
  </div>
</template>

<script>
import Cars from './Cars.vue';
import Visitor from './Visitor.vue';
import CarDoings from './CarDoings.vue';
import VisitorAccess from './VisitorAccess.vue';
export default {
  components:{Cars,Visitor,VisitorAccess,CarDoings},
  data() {
    return {

    };
  },
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    },
    toCar(path){
      this.$router.push(path);
    },
    toVisitor(path){
      this.$router.push(path);
    },
    toCarDoing(path){
      this.$router.push(path);
    },
    toVisitorAccess(path){
      this.$router.push(path);
    },
    handlerMenu(path){
      this.$router.push(path);
      this.$router.push("/Equi");
    },
    toWu(path){
      this.$router.push(path);
    },
  },
};

</script>
